<template>
  <div class="person">
    <div class="head">
      <ul class="layui-nav">
        <li class="layui-nav-item">
          <a href="./index">首页</a>
        </li>
        <li class="layui-nav-item">
          <a href="">查看消息<span class="layui-badge">9</span></a>
        </li>
        <li class="layui-nav-item">
          <a href="">动态<span class="layui-badge-dot"></span></a>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">
            <img src="http://t.cn/RCzsdCq" class="layui-nav-img">
            罗宝            </a>
          <dl class="layui-nav-child">
            <dd><a href="">基本资料</a></dd>
            <dd><a href="">安全设置</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item"><a href="/train/public/index.php/admin/home/logout.html">退了</a></li>
      </ul>
    </div>
    <div style="padding: 20px; background-color: #F2F2F2;">
      <div class="layui-row layui-col-space15">
        <div class="layui-col-md3">
          <div class="layui-card">
            <div class="layui-card-body">
              <div id="info">
                <img src="//t.cn/RCzsdCq">
                <li>
                  <a href="#">修改头像</a></li>
                <h2>罗宝</h2>
                <h6></h6>
                <h6>余额：11110</h6>
              </div>
            </div>
            <div class="layui-card-header">个人中心</div>
            <div class="layui-card-body">
              <!--添加一个即时通讯-->
              <a href="gerenzhongxin.html"><i class="layui-icon layui-icon-dialogue" style="font-size: 25px; color: gray;"></i>消息</a><br><br>
              <a href="xuexizhoubao.html"><i class="layui-icon layui-icon-form" style="font-size: 25px; color: gray;"></i>学习周报</a><br><br>
              <a href="gerenxinxi.html"><i class="layui-icon layui-icon-username" style="font-size: 25px; color: gray;"></i>个人信息</a><br><br>
              <a href="wodeshoucang.html"><i class="layui-icon layui-icon-star" style="font-size: 25px; color: gray;"></i>我的收藏<br><br>
              </a><a href="gouwuche.html"><i class="layui-icon layui-icon-cart-simple" style="font-size: 30px; color: gray;"></i>购物车</a>
            </div>
          </div>
        </div>
        <div class="layui-col-md9">
          <div class="layui-card">
            <div class="layui-card-header">收到的消息</div>
            <div class="layui-card-body">
              <table class="layui-table" lay-skin="line">
                <colgroup>
                  <col width="150">
                  <col width="200">
                  <col>
                </colgroup>
                <thead>
                <tr>
                  <th></th>
                  <th>发送人</th>
                  <th>标题</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>管理员</td>
                  <td>系统维护(12月25日)</td>
                </tr>
                <tr>
                  <td><i class="layui-icon layui-icon-chat" style="font-size: 30px; color: gray;"></i></td>
                  <td>系统</td>
                  <td>经验奖励-完成任务</td>
                </tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
    export default {
        name: "Geren",
        data(){
            return {

            }
        }

    }
</script>

<style scoped>
  .person {
    width: 100%;
    height: auto;
    margin: 0 auto;
  }
</style>
